<template>
    <div>
        <h2>展示图书</h2>
        <table>
            <tr>
                <td>id</td>
                <td>name</td>
                <td>price</td>
                <td>img</td>
                <td>author_id</td>
                <td>操作</td>
            </tr>
             <tr v-for="i in items" :key="i.id">
                <td>{{i.id}}</td>
                <td>{{i.name}}</td>
                <td>{{i.price}}元</td>
                <td>{{i.img}}</td>
                <td>{{i.author_id}}</td>
                <td @click="del(i.id)">删除</td>
            </tr>
        </table>
    </div>
</template>

<script>
import axios from "axios"
import {show_book} from "../axios_api/api.js"
import {delete_book} from "../axios_api/api.js"
export default {
    name:"showbook",
    data() {
        return {
            items:"",
            
        }
    },
   mounted(){
        axios({
            url:'http://127.0.0.1:8000/week3/book/',
            method:'get'
        }).then(res=>{
            if(res.data.code==200){
                this.items = res.data.data;
            }
        })
    },
    methods:{
        // showbook(){
        //     show_book().then(res=>{
        //         console.log(res)
        //         this.items == res.data.data
        //     })
        // },
        del(id){
            var data = {"id":id}
            delete_book(data).then(res=>{
                console.log(res)
                window.location.reload()
            })
        }
    },
    
    created() {
        this.showbook()
    },
}

</script>

<style>

</style>
